﻿@{
    Layout = null;
}
<!DOCTYPE html>
<html style="height: 100%">
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
    @Scripts.Render("~/bundles/jquery")
    @Scripts.Render("~/jqueryEasyui/js")
    @Styles.Render("~/jqueryEasyui/css")
    <link href="http://cdn.bootcss.com/twitter-bootstrap/2.2.2/css/bootstrap.min.css" rel="stylesheet">
    <script src="/Scripts/jQuery.Extensions.js"></script>
    <script type="text/javascript">
        $(function () {
            //创建框架
            $('#cc').layout();

            //创建左侧树
            $("#menu").tree({
                url: "/adminweb/index/GetMenuTree",
                onSelect: function (node) {
                    var content = '<iframe scrolling="no" overflow="hidden" frameborder="0" src="' + node.url + '" style="width:100%;height:98%;"></iframe>';
                    //var content = '<iframe scrolling="no" overflow="hidden" frameborder="0" src="/adminweb/menu/" style="width:100%;height:98%;"></iframe>';
                    if (!$("#tabs").tabs("exists", node.text)) {
                        $("#tabs").tabs("add", {
                            title: node.text,
                            closable: true,
                            content: content
                        });

                        $.ifdata("a", "bbb");
                        //创建右侧tab
                        //$("#dd").dialog({
                        //    title: 'My Dialog',
                        //    width: 900,
                        //    height: 400,
                        //    closed: false,
                        //    cache: false,
                        //    content: '<iframe scrolling="no" frameborder="0" src="/adminweb/user/" style="width:100%;height:98%;"></iframe>',
                        //    modal: true,
                        //    buttons: [
                        //        {
                        //            text: 'Save',
                        //            handler: function () {
                        //                var a = $("#dd").find("iframe")[0].contentWindow.$("#dd")
                        //                alert($.ifdata("a"));
                        //            }
                        //        }, {
                        //            text: 'Close',
                        //            handler: function () { }
                        //        }]
                        //});
                    } else {
                        $("#tabs").tabs("select", node.text);
                    }
                }
            })

            //创建右侧tab
            $("#tabs").tabs({
                height: $("#tabs").parent("div").height() - 5,
            });


        });

        function setHeight() {
            var c = $('#cc');
            var p = c.layout('panel', 'center');    // get the center panel
            var oldHeight = p.panel('panel').outerHeight();
            p.panel('resize', { height: 'auto' });
            var newHeight = p.panel('panel').outerHeight();
            c.layout('resize', {
                height: (c.height() + newHeight - oldHeight)
            });
        }
    </script>
</head>
<body style="height: 100%">
    <div id="cc" style="width: 100%; height: 100%;">
        @*头部*@
        <div data-options="region:'north'" style="height: 50px"></div>

        @*左侧菜单*@
        <div data-options="region:'west',split:true" style="width: 250px;">
            <ul id="menu"></ul>
        </div>

        @*右侧tabs*@
        <div data-options="region:'center'">
            <div id="tabs">
                <div id="tabs-a" title="首页">
                    <br />
                    <br />
                    <br />
                    <br />
                    <br />
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</div>

            </div>
        </div>
    </div>
    <div id="dd"></div>
</body>
</html>
